<div class="m-page-title">
	<h2 class="u-tt u-tt-lg">表单元素</h2>
</div>
<div class="m-callout m-callout-warning">
	<div class="m-callout-title">基础表单样式</div>
	<p>
	用于表单页面的样式以及表单处理的基础html</p>
</div>
<div class="u-text">tab菜单含标题</div>
<div class="m-highlight">
	<pre class="prettyprint">&lt;div class=&quot;m-tab s-tab&quot;&gt;<br />	&lt;h2 class=&quot;u-tt&quot;&gt;表单页演示&lt;/h2&gt;<br />	&lt;ul&gt;<br />		&lt;li&gt;&lt;a href=&quot;#&quot;&gt;内容列表&lt;/a&gt;&lt;/li&gt;<br />		&lt;li class=&quot;z-crt&quot;&gt;&lt;a href=&quot;#&quot;&gt;添加内容&lt;/a&gt;&lt;/li&gt;<br />	&lt;/ul&gt;<br />&lt;/div&gt;</pre>
</div>
<div class="u-text">基础样式代码</div>
<div class="m-highlight">
	<pre class="prettyprint">&lt;div class=&quot;m-form&quot;&gt;<br />    &lt;form name=&quot;&quot; action=&quot;#&quot; method=&quot;get&quot; id=&quot;form&quot;&gt;<br />        &lt;fieldset&gt;<br />            这里方式表单代码<br />        &lt;/fieldset&gt;<br />    &lt;/form&gt;<br />&lt;/div&gt;	<br />底部可以直接放置表单自动处理js，具体查看js说明</pre>
</div>

<div class="u-text">文本框</div>
<div class="m-highlight">
	<pre class="prettyprint">&lt;div class=&quot;formitm&quot;&gt;<br />	&lt;label class=&quot;lab&quot;&gt;标题：&lt;/label&gt;<br />   	&lt;div class=&quot;ipt&quot;&gt;<br />   		&lt;input type=&quot;text&quot; class=&quot;u-ipt u-ipt-6&quot; /&gt;<br />			&lt;p&gt;这是提示&lt;/p&gt;<br />	&lt;/div&gt;<br />&lt;/div&gt;<br />u-ipt-1至u-ipt-7代表不同的宽度</pre>
</div>
<div class="u-text">多行文本框</div>
<div class="m-highlight">
	<pre class="prettyprint">&lt;div class=&quot;formitm&quot;&gt;<br />	&lt;label class=&quot;lab&quot;&gt;标题：&lt;/label&gt;<br />   	&lt;div class=&quot;ipt&quot;&gt;<br />   		&lt;textarea  class=&quot;u-tta u-tta-6&quot;&gt;&lt;/textarea&gt;<br />			&lt;p&gt;这是提示&lt;/p&gt;<br />	&lt;/div&gt;<br />&lt;/div&gt;<br />u-tta-1至u-tta-7代表不同的宽度</pre>
</div>
<div class="u-text">多选与单选</div>
<div class="m-highlight">
	<pre class="prettyprint">&lt;div class=&quot;formitm&quot;&gt;<br />	&lt;label class=&quot;lab&quot;&gt;标题：&lt;/label&gt;<br />   	&lt;div class=&quot;ipt&quot;&gt;<br />   		&lt;label class=&quot;u-opt&quot;&gt;&lt;input name=&quot;u-radio&quot; type=&quot;radio&quot; value=&quot;&quot; /&gt;单选&lt;/label&gt;<br />			&lt;label class=&quot;u-opt&quot;&gt;&lt;input name=&quot;&quot; type=&quot;checkbox&quot; value=&quot;&quot; /&gt;多选&lt;/label&gt;<br />			&lt;p&gt;这是提示&lt;/p&gt;<br />	&lt;/div&gt;<br />&lt;/div&gt;</pre>
</div>
<div class="u-text">按钮</div>
<div class="m-highlight">
	<pre class="prettyprint">&lt;button class=&quot;u-btn&quot; type=&quot;button&quot;&gt;按钮&lt;/button&gt;<br />可选class<br />.s-btn-c1 红色<br />.s-btn-c2 黄色<br />.s-btn-c3 绿色<br />.s-btn-c4 灰色<br />.u-btn-lg 较大<br />.u-btn-sm 较小	</pre>
</div>
<script>
Do.ready('prettify',function() {
	prettyPrint();
});
</script>